@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  vertical-align: baseline; }

html {
  line-height: 1; }

ol, ul {
  list-style: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

caption, th, td {
  text-align: left;
  font-weight: normal;
  vertical-align: middle; }

q, blockquote {
  quotes: none; }

q:before, q:after, blockquote:before, blockquote:after {
  content: "";
  content: none; }

a img {
  border: none; }



/*------------------------------------------------------------------
[Main menu]
*/
.refade {
  animation-name: refade;
  animation-duration: 1s;
  animation-fill-mode: both; }

@-webkit-keyframes refade {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@keyframes refade {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

html {
  width: 100%;
  height: 100%; }

body {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  font-family: "Proxima Nova Soft", Arial, sans-serif;
  font-size: 16px;
  color: #293b4c;
  line-height: 1.5;
}

img {
  border: none; }

a:link, a:visited, a:active {
  text-decoration: none; }

a:focus, a:hover {
  text-decoration: none;
  outline: 0; }

button:focus,
input:focus,
textarea:focus {
  outline: 0; }

h1, h2, h3, h4 {
  line-height: 1.4;
  font-family: "Proxima Nova Soft Bold", Arial, sans-serif; }

h1 {
  font-size: 24px; }

h2 {
  font-size: 24px; }

h3 {
  font-size: 20px; }

h4 {
  font-size: 18px; }

p {
  margin: 16px 0;
  line-height: 1.5; }

.center {
  text-align: center; }

.clear {
  clear: both; }

.clearfix:before, .clearfix:after {
  content: "";
  display: table;
  line-height: 0; }

.clearfix::after {
  clear: both; }

/* apply a natural box layout model to all elements, but allowing components to change */
html {
  box-sizing: border-box; }

*, *:before, *:after {
  box-sizing: inherit; }

/* Remove IE10's “clear field” X button on inputs */
input::-ms-clear {
  width: 0;
  height: 0;
  display: none; }

/*------------------------------------------------------------------
[2. Header Styles]
*/
.page-template-form .page-header {
  margin: 0;
  padding: 0;
  height: 154px;
  border-bottom: 0 none transparent; }

.page-template-form .logo-head {
  display: inline-block;
  margin: 61px 0 0 0; }

.page-template-panel .page-header {
  position: relative;
  margin: 0;
  padding: 0;
  height: 108px;
  border-bottom: 0 none transparent;
  background: #f6f8f9; }

.page-template-panel .header-mobile .logo-head {
  position: relative;
  left: auto;
  top: auto;
  height: 94px;
  line-height: 94px; }

.panel-page-title {
  text-transform: uppercase;
  text-align: center; }

.panel-page-title h1 {
  margin: 0;
  line-height: 108px;
  font-size: 24px; }

.page-title-line {
  position: absolute;
  left: 50%;
  bottom: 0;
  margin: 0 0 0 -97px;
  width: 194px;
  height: 3px;
  background: #1fce6d; }

/* mobile header */
.header-mobile {
  display: none;
  position: relative;
  height: 94px;
  background: #293b4d;
  text-align: center; }

.header-mobile-button {
  width: 94px;
  height: 94px;
  line-height: 94px; }

.header-mobile-button.link-left {
  position: absolute;
  left: 0;
  top: 0; }

.header-mobile-button.link-left .svg {
  vertical-align: middle; }

.header-mobile-button.link-left .svg path {
  fill: #98a8b3; }

.menu-mobile-trigger {
  position: absolute;
  right: 0;
  top: 0; }

.menu-mobile-trigger .line {
  position: absolute;
  top: 46px;
  right: 30px; }

.menu-mobile-trigger .line, .menu-mobile-trigger .line:before, .menu-mobile-trigger .line:after {
  width: 32px;
  height: 2px;
  background: #98a8b3; }

.menu-mobile-trigger .line:before {
  content: '';
  position: absolute;
  top: -10px;
  left: 0; }

.menu-mobile-trigger .line:after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 0; }

.menu-mobile-trigger:hover .line, .menu-mobile-trigger:hover .line:before, .menu-mobile-trigger:hover .line:after,
.menu-mobile-trigger.active .line,
.menu-mobile-trigger.active .line:before,
.menu-mobile-trigger.active .line:after {
  width: 32px;
  height: 2px;
  background: #ffffff; }

/* mobile header END */
/* Text pages like Homepage, FAQ, etc */
.page-template-text .page-header {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100px;
  border-bottom: 0 none transparent;
  -webkit-transition: opacity 300ms ease;
  -moz-transition: opacity 300ms ease;
  -o-transition: opacity 300ms ease;
  transition: opacity 300ms ease; }

.page-template-text .page-header.fixed {
  position: fixed; }

.page-template-text .logo-head {
  float: left;
  margin: 55px 0 0 0; }

.page-template-text .page-title {
  width: 100%; }

.page-template-text .page-title .title {
  position: relative;
  margin: 0;
  padding: 0 0 32px 0;
  font-size: 36px;
  line-height: 54px;
  color: #ffffff;
  font-family: "Centrale Sans Rounded Medium";
  text-align: center; }

.page-template-text .page-title .title:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  margin: 0 0 0 -112px;
  width: 224px;
  height: 3px;
  background: #1fce6d; }

/*------------------------------------------------------------------
[3. Navigation & Menus]
*/
.panel-sidebar-wrap {
  position: absolute;
  right: 0;
  top: 0;
  width: 0;
  height: 100%;
  overflow: visible; }

.panel-sidebar {
  float: right;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 112;
  width: 114px;
  height: 100%;
  background: #293b4d;
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  transition: all 300ms ease; }

.panel-menu {
  position: relative;
  z-index: 101;
  padding: 14px 0 0 0;
  background: #293b4d; }

.panel-menu ul {
  margin: 0;
  padding: 0;
  list-style: none; }

.panel-menu li {
  position: relative;
  height: 84px; }

.panel-menu a {
  position: relative;
  z-index: 22;
  display: block;
  height: 84px;
  line-height: 84px;
  text-align: center;
  background-color: #293b4d; }

.panel-menu a:hover,
.panel-menu .menu-item-active a {
  background-color: #223140; }

.panel-menu .line {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  z-index: 21;
  width: 6px;
  height: 100%;
  background: #1fce6d;
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  transition: all 300ms ease; }

.panel-menu li:hover .line,
.panel-menu .menu-item-active .line {
  left: -6px; }

.panel-menu .svg {
  vertical-align: middle; }

.panel-menu li:hover .svg path,
.panel-menu li:hover .svg rect,
.panel-menu li:hover .svg polygon,
.panel-menu .menu-item-active .svg path,
.panel-menu .menu-item-active .svg rect,
.panel-menu .menu-item-active .svg polygon {
  fill: #1fce6d; }

.panel-menu.faded ul {
  opacity: 0.5; }

/* user profile panel, menu and submenus */
.user-profile {
  position: relative; }

.user-profile-photo {
  cursor: pointer;
  position: relative;
  z-index: 101;
  display: block;
  width: 114px;
  height: 108px;
  overflow: hidden; }

.user-profile-photo img {
  width: 100%;
  height: auto; }

.user-profile-panel {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 100;
  transform: translateX(50px);
  width: 226px;
  background: #ffffff;
  transition: all 300ms ease;
  box-shadow: 0 5px 10px 5px rgba(41, 59, 77, 0.25); }

.user-profile-panel.active {
  transform: translateX(-226px); }

.user-profile-info {
  padding: 30px 0 0 25px;
  height: 108px;
  color: #293b4d; }

.user-profile-info .user-name {
  font-size: 18px;
  font-weight: bold;
  line-height: 24px; }

.user-timepot-menu-control {
  cursor: pointer;
  display: block;
  position: relative;
  padding: 0 0 0 25px;
  height: 60px;
  padding: 0 0 0 25px;
  line-height: 60px;
  color: #293b4d;
  background: #ffffff;
  border-top: 1px solid #eff1f3;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

.user-timepot-menu-control .glyphicon {
  position: absolute;
  right: 25px;
  top: 25px;
  color: #949da6;
  font-size: 10px;
  transform: rotate(90deg);
  transition: all 300ms ease; }

.user-timepot-menu-control.active .glyphicon {
  transform: rotate(-90deg); }

.user-profile-navigations {
  position: relative;
  overflow: hidden; }

.user-timepot-menu {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 102;
  padding: 0 0 59px 0;
  width: 100%;
  min-height: 100%;
  background: #ffffff;
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  transition: all 300ms ease; }

.user-timepot-menu.active {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0); }

.user-timepot-menu ul {
  list-style: none;
  margin: -10px 0 0 0;
  padding: 0; }

.user-timepot-menu a {
  display: block;
  padding: 7px 0 7px 24px; }

.user-timepot-menu a:hover,
.user-timepot-menu .current a {
  font-weight: bold; }

.user-timepot-menu .current a:before {
  display: inline-block;
  content: '';
  margin: 0 5px 0 0;
  vertical-align: middle;
  width: 6px;
  height: 6px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  -ms-border-radius: 5px;
  border-radius: 5px;
  background: #1fce6d; }

.user-timepot-menu .timepot-new input {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 0 10px 0 24px;
  width: 100%;
  height: 59px;
  background: #f3f5f7;
  border: 0 none; }

.user-profile-menu {
  position: relative;
  z-index: 101;
  background: #f3f5f7; }

.user-profile-menu ul {
  list-style: none;
  margin: 0;
  padding: 10px 0; }

.user-profile-menu a {
  display: block;
  padding: 10px 0 10px 25px;
  font-size: 16px;
  line-height: 18px;
  color: #293b4d; }

.user-profile-menu a:hover {
  font-weight: bold; }

.user-profile-menu .menu-item-gray a {
  color: #aebbc3; }

/* Text pages like Homepage, FAQ, etc */
.page-template-text .header-nav {
  position: relative;
  float: right;
  margin: 58px 0 0 0; }

.page-template-text .main-menu {
  margin: 0 -12px 0 0;
  font-size: 18px;
  line-height: 36px; }

.page-template-text .main-menu li {
  float: left; }

.page-template-text .main-menu a:not(.btn) {
  padding: 0 14px;
  color: #aebbc3; }

.page-template-text .main-menu a:not(.btn):hover {
  color: white; }

.page-template-text .main-menu a.btn {
  margin-top: -7px;
  margin-left: 13px; }

.page-template-text .sidenav-toggle {
  position: absolute;
  top: 0;
  right: -82px;
  float: left;
  width: 36px;
  height: 36px;
  cursor: pointer; }

.page-template-text .sidenav-toggle .custom-bars {
  display: block;
  position: relative;
  left: 8px;
  top: 18px;
  width: 20px;
  height: 2px;
  background-color: #aebbc3;
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  transition: all 300ms ease; }

.page-template-text .sidenav-toggle .custom-bars:after, .page-template-text .sidenav-toggle .custom-bars:before {
  content: '';
  position: absolute;
  top: -6px;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #aebbc3;
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  transition: all 300ms ease; }

.page-template-text .sidenav-toggle .custom-bars:before {
  top: 6px; }

.page-template-text .sidenav-toggle:hover .custom-bars,
.page-template-text .sidenav-toggle:hover .custom-bars:after,
.page-template-text .sidenav-toggle:hover .custom-bars:before {
  background-color: white; }

.page-template-text .sidenav-toggle.active .custom-bars,
.page-template-text .sidenav-toggle.active:hover .custom-bars {
  background-color: transparent; }

.page-template-text .sidenav-toggle.active .custom-bars:after {
  top: 0;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg); }

.page-template-text .sidenav-toggle.active .custom-bars:before {
  top: 0;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg); }

.page-template-text .sidenav {
  position: fixed;
  display: table;
  overflow: hidden;
  top: 0;
  left: 0;
  z-index: 99;
  width: 100%;
  height: 100%;
  background: rgba(41, 59, 77, 0.95);
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  transition: all 300ms ease; }

.page-template-text .sidenav.active {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  transform: translateY(0); }

.page-template-text .sidenav ul {
  margin: 0;
  padding: 0;
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  list-style: none; }

.page-template-text .sidenav li {
  position: relative; }

.page-template-text .sidenav a {
  cursor: pointer;
  position: relative;
  display: block;
  text-align: center;
  padding: 20px 0 20px 20px;
  font-size: 20px;
  line-height: 24px;
  color: #aebbc3; }

.page-template-text .sidenav .mobile-visible {
  display: none; }

.page-template-text .sidenav a:hover,
.page-template-text .sidenav .menu-item-active a {
  color: white; }

.no-link {
  cursor: default; }

.scroll-to-id {
  cursor: pointer; }

@media only screen and (max-height: 650px) {
  .page-template-text .sidenav a {
    padding: 10px 0 10px 0; } }

@media only screen and (max-height: 500px) {
  .page-template-text .sidenav {
    padding: 60px 0 0 0; }
  .page-template-text .sidenav a {
    padding: 5px 0 5px 0;
    font-size: 18px;
    line-height: 20px; } }

@media only screen and (max-width: 480px) {
  .page-template-text .sidenav {
    padding: 60px 0 0 0; } }

/*------------------------------------------------------------------
[5. Forms]
*/
.form-title {
  text-transform: uppercase; }

/* Editable rows - Projects */
.row-js-edit {
  position: relative;
  display: block; }

.row-js-edit-field {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  padding: 0 0 0 20px;
  width: 100%;
  height: 100%;
  border: 0 none;
  background: #ffffff; }

.row-js-edit-field:show {
  display: block; }

/* Editable rows - Projects END */
.form-date-input {
  display: inline-block;
  margin: 0;
  width: 148px; }

.form-date-input input {
  opacity: 0.5; }

.form-date-input input:focus {
  opacity: 1; }

.form-login-input input {
  padding: 0 0 0 34px;
  background: url(../images/icon-login.svg) no-repeat 9px 12px; }

.form-logout-input input {
  padding: 0 0 0 34px;
  background: url(../images/icon-logout.svg) no-repeat 7px 12px; }

.form-submit-row {
  margin: 32px 0 7px 0; }

.hero {
  position: relative;
  width: 100%;
  // height: 345px;
  overflow: hidden;
  background-color: #636B6E;
  background-image: url(/images/restaurant/login-register.jpg);
  background-repeat: no-repeat;
  background-position: 100% 100%; 
}

.hero .hero-content-container {
  position: relative;
  z-index: 10;
  height: 345px; 
}

.hero-subpage {
  min-height: 455px;
  background-position: center top; }

.hero-subpage .page-title {
  position: relative;
  z-index: 10;
  margin: 120px 0 0 0; }

.hero-subpage .main-caption {
  margin: 36px 0 0 0;
  text-align: center;
  color: white; }

.hero-subpage .main-caption p {
  margin: 0 0 20px 0; }

.hero-subpage .main-caption a {
  color: #1fce6d;
  text-decoration: underline; }

.hero-home {
  height: 766px; 
}

.hero-home .hero-content-container {
  height: 910px; }

.hero-home .page-title {
  position: absolute;
  left: 0;
  bottom: 122px;
  letter-spacing: 0.05em; }

.hero-home .hero-content {
  color: white; }

.hero-home .hero-captions {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 910px; }

.hero-home .hero-captions.fixed {
  position: fixed;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 1170px; }

.hero-home .caption-left {
  position: absolute;
  top: 304px;
  left: 15px;
  font-family: "Centrale Sans Rounded Medium";
  font-size: 36px;
  line-height: 54px;
  color: white;
  letter-spacing: 0.02em; }

.hero-home .caption-left h2 {
  font-size: 32px;
  line-height: 34px; }

.hero-home .caption-left p {
  font-size: 24px; }

.hero-home .caption-right {
  position: absolute;
  top: 320px;
  right: 0;
  width: 355px;
  font-size: 16px;
  line-height: 24px; }

.hero-home .caption-right a {
  color: #1fce6d;
  text-decoration: underline; }

.hero-home .middle {
  position: relative;
  margin: 0 auto;
  width: 504px;
  color: #a0bfdc;
  text-align: center; }

.hero-home .middle p {
  margin: 0 0 20px 0; }

.hero-home .middle .cta {
  position: absolute;
  top: 450px;
  left: 0;
  z-index: 4;
  padding: 40px 0 0 0;
  width: 100%;
  // background: url(../images/page-text/hero/btn-shade.png) top center no-repeat; 
}

.hero-home .hero-image {
  width: 100%;
  height: 572px; }

.hero-home .hero-image .parts {
  position: absolute;
  top: 28px;
  left: -16px;
  z-index: 1;
  height: auto;
  opacity: 0.25; }

.hero-home .hero-image .parts.animate {
  -webkit-animation: hero-floating-parts 9s linear infinite;
  -moz-animation: hero-floating-parts 9s linear infinite;
  -ms-animation: hero-floating-parts 9s linear infinite;
  -o-animation: hero-floating-parts 9s linear infinite;
  animation: hero-floating-parts 9s linear infinite; }

.hero-home .hero-image .papers {
  position: absolute;
  top: 116px;
  left: 58px;
  z-index: 4;
  width: 376px;
  height: auto; }

.hero-home .hero-image .papers.animate {
  -webkit-animation: hero-floating-papers 9s linear infinite;
  -moz-animation: hero-floating-papers 9s linear infinite;
  -ms-animation: hero-floating-papers 9s linear infinite;
  -o-animation: hero-floating-papers 9s linear infinite;
  animation: hero-floating-papers 9s linear infinite; }

.hero-home .hero-image .character {
  position: absolute;
  top: -50px;
  left: 40%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  z-index: 3;
  margin: 114px auto 0 auto;
  width: 370px;
  height: auto; }

.hero-home .hero-image .character img {
  width: 100%;
  height: auto; }

.hero-home .hero-image .eclipse-shade {
  opacity: 0.25;
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%); }

.hero-faq-image {
  position: absolute;
  right: -60px;
  bottom: -14px;
  z-index: 9;
  width: 260px;
  height: 235px;
  background-image: url(../images/page-text/hero/hero-faq-image.png); }

/* main hero animations */
/* floating features (parts) */
@-webkit-keyframes hero-floating-parts {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); }
  50% {
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px); }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); } }

@keyframes hero-floating-parts {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); }
  50% {
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px); }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); } }

/* floating papers */
@-webkit-keyframes hero-floating-papers {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); }
  50% {
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px); }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); } }

@keyframes hero-floating-papers {
  0% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); }
  50% {
    -webkit-transform: translateY(30px);
    -moz-transform: translateY(30px);
    -ms-transform: translateY(30px);
    transform: translateY(30px); }
  100% {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0); } }

/* Hero Character parts animations */
.hero-home .hide-part {
  opacity: 0; }

.hero-home .hero-character-show {
  -webkit-animation-name: hero-character-show;
  -webkitanimation-delay: 200ms;
  -webkit-animation-duration: 600ms;
  -webkit-animation-direction: linear;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
  -ms-animation-name: hero-character-show;
  -ms-animation-delay: 200ms;
  -ms-animation-duration: 600ms;
  -ms-animation-direction: linear;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: forwards;
  animation-name: hero-character-show;
  animation-delay: 200ms;
  animation-duration: 600ms;
  animation-direction: linear;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
  opacity: 0; }

@-webkit-keyframes hero-character-show {
  10% {
    opacity: 0;
    top: -50px; }
  70% {
    top: 14px; }
  100% {
    opacity: 1;
    top: 4px; } }

@-ms-keyframes hero-character-show {
  10% {
    opacity: 0;
    top: -50px; }
  70% {
    top: 14px; }
  100% {
    opacity: 1;
    top: 4px; } }

@keyframes hero-character-show {
  10% {
    opacity: 0;
    top: -50px; }
  70% {
    top: 14px; }
  100% {
    opacity: 1;
    top: 4px; } }

.hero-home .hero-papers-show {
  -webkit-animation-name: hero-papers-show;
  -webkitanimation-delay: 500ms;
  -webkit-animation-duration: 1000ms;
  -webkit-animation-direction: linear;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
  -ms-animation-name: hero-papers-show;
  -ms-animation-delay: 300ms;
  -ms-animation-duration: 1000ms;
  -ms-animation-direction: linear;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: forwards;
  animation-name: hero-papers-show;
  animation-delay: 300ms;
  animation-duration: 1000ms;
  animation-direction: linear;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
  opacity: 0; }

@-webkit-keyframes hero-papers-show {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    z-index: 2; }
  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    z-index: 4; } }

@-ms-keyframes hero-papers-show {
  0% {
    opacity: 0;
    -ms-transform: scale(0, 0);
    z-index: 2; }
  100% {
    opacity: 1;
    -ms-transform: scale(1, 1);
    z-index: 4; } }

@keyframes hero-papers-show {
  0% {
    opacity: 0;
    transform: scale(0);
    z-index: 2; }
  100% {
    opacity: 1;
    transform: scale(1);
    z-index: 4; } }

.hero-home .hero-image .hero-eclipse-shade-show {
  -webkit-animation-name: hero-eclipse-shade-show;
  -webkitanimation-delay: 300ms;
  -webkit-animation-duration: 600ms;
  -webkit-animation-direction: linear;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
  -ms-animation-name: hero-eclipse-shade-show;
  -ms-animation-delay: 300ms;
  -ms-animation-duration: 600ms;
  -ms-animation-direction: linear;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: forwards;
  animation-name: hero-eclipse-shade-show;
  animation-delay: 300ms;
  animation-duration: 600ms;
  animation-direction: linear;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
  opacity: 0; }

@-webkit-keyframes hero-eclipse-shade-show {
  0% {
    opacity: 0; }
  100% {
    opacity: 0.25; } }

@-ms-keyframes hero-eclipse-shade-show {
  0% {
    opacity: 0; }
  100% {
    opacity: 0.25; } }

@keyframes hero-eclipse-shade-show {
  0% {
    opacity: 0; }
  100% {
    opacity: 0.25; } }

.page-template-text {
  font-family: "Centrale Sans Rounded Book"; }

.page-template-text .btn-primary {
  padding: 20px 44px 16px 44px;
  font-family: "Centrale Sans Rounded Bold";
  font-size: 18px;
  line-height: 24px;
  text-transform: none; }

.main-content {
  position: relative;
  z-index: 10;
  background: url('/images/bg_2.png') no-repeat center center; }

.main-content h3 {
  font-size: 24px;
  font-family: "Centrale Sans Rounded Medium";
  color: #1fce6d; }

.page-footer {
  background: #edf0f2;
  border-top: 1px solid #dce2e5; }

.page-footer-columns {
  display: table;
  width: 100%; }

.page-footer-columns .column {
  display: table-cell;
  vertical-align: middle; }

.page-footer-columns .about {
  padding: 64px 60px 60px 0;
  width: 370px;
  border-right: 1px solid #dce2e5; }

.page-footer-columns .about .heading {
  margin: 0 0 16px 0;
  font-family: "Centrale Sans Rounded Bold";
  font-size: 20px;
  line-height: 24px;
  color: #98a8b2; }

.page-footer-columns .about p {
  margin: 0 0 16px 0;
  font-size: 16px;
  line-height: 24px;
  color: #98a8b2; }

.page-footer-columns .about .social-media {
  margin: 26px 0 0 0; }

.page-footer-columns .about .social-media a {
  margin: 0 8px 0 0;
  opacity: 0.5;
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  transition: all 300ms ease; }

.page-footer-columns .about .social-media a:hover {
  opacity: 1; }

.page-footer-columns .copyright-column {
  vertical-align: bottom;
  padding: 0 0 116px 0;
  text-align: right; }

.footer-menu {
  padding: 0 0 0 64px; }

.footer-menu ul {
  display: inline-block;
  width: 140px; }

.ml-show {
  display: none; }

.alert {
  margin-bottom: 0;
  border-radius: 0; }

/*------------------------------------------------------------------
[10. Page Template - Holidays]
*/
.extended-features .feature-first {
  margin: -75px 0 0 0; }

.extended-features .feature {
  position: relative;
  height: 650px;
  overflow: hidden; }

.feature-content {
  position: relative;
  width: 100%;
  max-width: 1170px;
  height: 650px;
  margin: 0 auto; }

.feature-textblock {
  float: left;
  display: table;
  margin: 75px 0 0 100px;
  width: 300px;
  height: 480px; }

.feature-textblock .icon {
  width: 48px;
  height: auto;
  margin: 0 0 20px 0; }

.feature-textblock .icon path,
.feature-textblock .icon rect,
.feature-textblock .icon polygon {
  fill: #1fce6d; }

.feature-textblock .heading {
  margin: 0 0 28px 0; }

.feature-textblock-inner {
  display: table-cell;
  vertical-align: middle; }

.feature-textblock-inner p {
  margin: 26px 0 0 0;
  font-size: 18px;
  line-height: 30px; }

.feature-mockups {
  position: absolute;
  left: 430px;
  top: 0;
  min-width: 1500px; }

.feature-mockups img {
  float: left;
  position: relative; }

.feature-mockups .mobile {
  z-index: 6;
  top: 35px; }

.feature-mockups .laptop {
  z-index: 5;
  // top: -16px;
  // left: -110px; 
}

.feature-right .feature-textblock {
  float: right;
  margin: 30px 76px 0 0; }

.feature-right .feature-mockups {
  left: auto;
  right: 450px; }

.feature-right .feature-mockups img {
  float: right; }

.feature-right .mobile {
  top: 35px; }

.feature-right .laptop {
  top: -16px;
  left: auto;
  right: -110px; }

.feature-columns {
  margin: 70px 0; }

.feature-columns .list-wrap {
  width: 1170px;
  float: left;
  list-style: none;
  margin: 0 -15px;
  padding: 0; }

.feature-columns ul {
  width: 50%;
  float: left;
  list-style: none;
  margin: 0;
  padding: 0; }

.feature-columns li {
  float: left;
  padding: 0 15px 0 15px;
  width: 50%; }

.feature-columns .icon {
  margin: 0 0 16px 0;
  height: 32px; }

.feature-columns .heading {
  margin: 0 0 26px 0; }

.feature-columns p {
  margin: 26px 0 0 0;
  font-size: 18px;
  line-height: 30px; }

.cta-white {
  margin: 110px 0 0 0;
  padding: 55px 0;
  background: white;
  text-align: center; }

.cta-white .heading {
  margin: 0 0 6px 0;
  font-size: 30px;
  line-height: 36px; }

.cta-white p {
  margin: 6px 0 24px 0;
  font-size: 18px;
  line-height: 36px; }

.cta-white-grey {
  display: block;
  margin-top: 20px;
  color: #98a8b2; }

.testimonial {
  margin: 130px 0 70px 0;
  text-align: center; }

.testimonial .heading {
  font-family: "Centrale Sans Rounded Bold";
  color: #304559;
  font-size: 30px;
  line-height: 36px;
  margin: 0;
  padding: 0 0 32px;
  position: relative;
  text-align: center; }

.testimonial .heading:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  margin: 0 0 0 -112px;
  width: 224px;
  height: 3px;
  background: #1fce6d; }

.testimonial-list-wrap {
  position: relative;
  height: 310px;
  overflow: hidden; }

.testimonial-list {
  margin: 0;
  padding: 0;
  width: 300%;
  height: 250px;
  -webkit-transition: all 600ms ease;
  -moz-transition: all 600ms ease;
  -o-transition: all 600ms ease;
  transition: all 600ms ease; }

.testimonial-list li {
  float: left;
  font-size: 18px;
  line-height: 30px;
  color: #98a8b2; }

.testimonial-list .inner {
  margin: 0 auto;
  padding: 60px 20px 0 20px;
  max-width: 810px;
  width: 100%;
  height: 250px; }

.testimonial-list p {
  margin: 0;
  line-height: 30px;
  font-style: italic; }

.testimonial-list .client {
  margin: 48px 0 0 0; }

.testimonial-list .name {
  display: block;
  font-family: "Centrale Sans Rounded Bold";
  font-size: 14px;
  line-height: 20px;
  text-transform: uppercase;
  color: #293b4d; }

.testimonial-list .subtitle {
  font-size: 14px;
  line-height: 20px;
  font-family: "Centrale Sans Rounded Book";
  color: #98a8b2; }

.testimonial-pagination {
  margin: 22px 0 0 0;
  height: 10px;
  text-align: center; }

.testimonial-pagination li {
  display: inline-block;
  vertical-align: top;
  margin: 0 3px; }

.testimonial-pagination .dot {
  cursor: pointer;
  display: block;
  width: 10px;
  height: 10px;
  background: #bec0c2;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
  -webkit-transition: all 300ms ease;
  -moz-transition: all 300ms ease;
  -o-transition: all 300ms ease;
  transition: all 300ms ease; }

.testimonial-pagination .dot.current, .testimonial-pagination .dot:hover {
  background: #1fce6d; }

.color-white {
  color: #fff; }

/*------------------------------------------------------------------
[ Animations for Page Header and Hero on page scroll ]
*/
/* Page header fade-out */
.page-template-text .fade-out,
.page-template-text .page-header.fade-out,
.hero-home .hero-captions.fade-out {
  -webkit-animation-name: hp-fade-out;
  -webkit-animation-duration: 450ms;
  -webkit-animation-direction: linear;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
  animation-name: hp-fade-out;
  animation-duration: 450ms;
  animation-direction: linear;
  animation-timing-function: ease;
  animation-fill-mode: forwards; }

@-webkit-keyframes hp-fade-out {
  0% {
    opacity: 1;
    visibility: visible; }
  90% {
    opacity: 0; }
  100% {
    opacity: 0;
    visibility: hidden; } }

@keyframes hp-fade-out {
  0% {
    opacity: 1;
    visibility: visible; }
  90% {
    opacity: 0; }
  100% {
    opacity: 0;
    visibility: hidden; } }

/* Page header fade-in */
.page-template-text .fade-in,
.page-template-text .page-header.fade-in,
.hero-home .hero-captions.fade-in {
  -webkit-animation-name: hp-fade-in;
  -webkit-animation-duration: 450ms;
  -webkit-animation-direction: linear;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
  animation-name: hp-fade-in;
  animation-duration: 450ms;
  animation-direction: linear;
  animation-timing-function: ease;
  animation-fill-mode: forwards; }

@-webkit-keyframes hp-fade-in {
  0% {
    opacity: 0;
    visibility: visible; }
  100% {
    opacity: 1;
    visibility: visible; } }

@keyframes hp-fade-in {
  0% {
    opacity: 0;
    visibility: visible; }
  100% {
    opacity: 1;
    visibility: visible; } }

/* Hero Middle content scale-out */
.hero-home .hero-captions.scale-out,
.hero-home .middle.scale-out {
  -webkit-animation-name: hero-scale-out;
  -webkit-animation-duration: 600ms;
  -webkit-animation-direction: linear;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
  animation-name: hero-scale-out;
  animation-duration: 600ms;
  animation-direction: linear;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
  opacity: 0; }

@-webkit-keyframes hero-scale-out {
  0% {
    opacity: 1;
    -webkit-transform: scale(1); }
  95% {
    opacity: 0.4;
    -webkit-transform: scale(0.7); }
  100% {
    opacity: 0;
    -webkit-transform: scale(0.7);
    visibility: hidden; } }

@keyframes hero-scale-out {
  0% {
    opacity: 1;
    transform: scale(1); }
  95% {
    opacity: 0.4;
    transform: scale(0.7); }
  100% {
    opacity: 0;
    transform: scale(0.7);
    visibility: hidden; } }

/* Hero Middle content scale-in */
.hero-home .hero-captions.scale-in,
.hero-home .middle.scale-in {
  -webkit-animation-name: hero-scale-in;
  -webkit-animation-duration: 600ms;
  -webkit-animation-direction: linear;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
  -ms-animation-name: hero-scale-in;
  -ms-animation-duration: 600ms;
  -ms-animation-direction: linear;
  -ms-animation-timing-function: ease;
  -ms-animation-fill-mode: forwards;
  animation-name: hero-scale-in;
  animation-duration: 600ms;
  animation-direction: linear;
  animation-timing-function: ease;
  animation-fill-mode: forwards;
  opacity: 0; }

@-webkit-keyframes hero-scale-in {
  0% {
    opacity: 0;
    -webkit-transform: scale(0.7);
    visibility: hidden; }
  20% {
    opacity: 0.4;
    -webkit-transform: scale(0.7); }
  100% {
    opacity: 1;
    -webkit-transform: scale(1); } }

@-ms-keyframes hero-scale-in {
  0% {
    opacity: 0;
    -ms-transform: scale(0.7, 0.7);
    visibility: hidden; }
  20% {
    opacity: 0.4;
    -ms-transform: scale(0.7, 0.7); }
  100% {
    opacity: 1;
    -ms-transform: scale(1, 1); } }

@keyframes hero-scale-in {
  0% {
    opacity: 0;
    transform: scale(0.7);
    visibility: hidden; }
  20% {
    opacity: 0.4;
    transform: scale(0.7); }
  100% {
    opacity: 1;
    transform: scale(1); } }

/*------------------------------------------------------------------
[ Scroll reveal ]
*/
/* Hide items */
.sc-hidden .feature-textblock {
  opacity: 0.3;
  -webkit-transition: all 600ms ease;
  -moz-transition: all 600ms ease;
  -o-transition: all 600ms ease;
  transition: all 600ms ease; }

.sc-reveal .feature-textblock {
  opacity: 1; }

.sc-hidden.feature-left .feature-mockups {
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  transform: translateX(100%);
  -webkit-transition: all 600ms ease;
  -moz-transition: all 600ms ease;
  -o-transition: all 600ms ease;
  transition: all 600ms ease; }

.sc-hidden.feature-right .feature-mockups {
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  transform: translateX(-100%);
  -webkit-transition: all 600ms ease;
  -moz-transition: all 600ms ease;
  -o-transition: all 600ms ease;
  transition: all 600ms ease; }

.sc-reveal.feature-left .feature-mockups {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0); }

.sc-reveal.feature-right .feature-mockups {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0); }

.page-template-text .sc-reveal {
  -webkit-animation-name: sc-fade-in;
  -webkit-animation-duration: 450ms;
  -webkit-animation-direction: linear;
  -webkit-animation-timing-function: ease;
  -webkit-animation-fill-mode: forwards;
  animation-name: sc-fade-in;
  animation-duration: 450ms;
  animation-direction: linear;
  animation-timing-function: ease;
  animation-fill-mode: forwards; }

@-webkit-keyframes hp-fade-in {
  0% {
    opacity: 0;
    visibility: visible; }
  100% {
    opacity: 1;
    visibility: visible; } }

@keyframes hp-fade-in {
  0% {
    opacity: 0;
    visibility: visible; }
  100% {
    opacity: 1;
    visibility: visible; } }

.faq {
  position: relative;
  margin: 62px 0 0 0; }

.faq ol {
  list-style: decimal;
  padding-left: 30px; }

.faq-footer {
  position: relative;
  margin: 62px 0; }

.faq-footer hr {
  border-color: #e3e7ea; }

.faq-nav {
  position: relative;
  float: right;
  width: 320px; }

.faq-nav.fixed-end {
  right: 0; }

.faq-nav li {
  border-style: solid;
  border-width: 0 0 0 6px;
  border-color: #edf0f2;
  background-color: white;
  -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  -o-transition: all 400ms ease;
  transition: all 400ms ease; }

.faq-nav li:hover, .faq-nav li.current {
  border-color: #1fce6d;
  background-color: #fbfbfc; }

.faq-nav li:hover a, .faq-nav li.current a {
  color: #1fce6d; }

.faq-nav a {
  display: block;
  padding: 20px 0 20px 24px;
  font-size: 20px;
  font-family: "Centrale Sans Rounded Medium";
  line-height: 22px;
  color: #acb2b8;
  -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  -o-transition: all 400ms ease;
  transition: all 400ms ease; }

.faq-content {
  float: left;
  width: 780px; }

.faq-section-title {
  position: relative;
  margin: 20px 0 40px 0; }

.faq-section-title:before {
  content: '';
  position: absolute;
  top: 20px;
  left: 0;
  z-index: 5;
  width: 100%;
  height: 1px;
  background: #e3e7ea; }

.faq-section-title h2 {
  display: inline-block;
  position: relative;
  z-index: 6;
  margin: 0;
  font-family: "Centrale Sans Rounded Medium";
  color: #304559;
  font-size: 30px;
  border-style: solid;
  border-width: 0 40px 0 0;
  border-color: #edf0f2;
  background: #edf0f2; }

.faq-question {
  margin: 0 0 20px 0; }

.faq-question .trigger {
  display: block;
  cursor: pointer;
  margin: 0 0 20px 0; }

.faq-question .title {
  margin: 0;
  padding: 10px 0 10px 76px;
  overflow: hidden;
  background-image: url(../images/page-text/faq/icon-question.png);
  background-position: left center;
  background-repeat: no-repeat;
  font-size: 24px;
  line-height: 28px;
  font-family: "Centrale Sans Rounded Medium";
  color: #25c170; }

.faq-question .title .fa {
  margin: 0 0 0 20px;
  -webkit-transition: all 400ms ease;
  -moz-transition: all 400ms ease;
  -o-transition: all 400ms ease;
  transition: all 400ms ease;
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg); }

.faq-question.open .fa {
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg); }

.faq-question .answer {
  overflow: hidden;
  padding: 0 0 0 76px;
  height: auto;
  max-height: 0;
  -webkit-transition: all 800ms ease;
  -moz-transition: all 800ms ease;
  -o-transition: all 800ms ease;
  transition: all 800ms ease; }

.faq-question .answer p {
  margin: 0 0 30px 0;
  font-size: 18px;
  line-height: 30px; }

.faq-question .answer .image {
  display: block;
  margin: 0 0 60px 0; }

.faq-question .answer .image img {
  height: auto;
  -webkit-box-shadow: 0 5px 25px 0 rgba(0, 0, 0, 0.08);
  box-shadow: 0 5px 25px 0 rgba(0, 0, 0, 0.08); }

.faq-question.open .answer {
  max-height: 2000px; }

/*------------------------------------------------------------------
[14. Projects Colors]
*/
.project-color-red,
.barchart-horizontal-columns li .bar.red .inner {
  background-color: #ea4b35; }

.search-projects-results .project-red a:hover {
  background: rgba(234, 75, 53, 0.3); }

.yourweek-projects-list .project-red,
.yourweek-projects .project-red tr:nth-of-type(2) .project-task,
.yourweek-projects-time .time-list .project-red tr:nth-of-type(2) .project-task {
  border-color: rgba(234, 75, 53, 0.3) #ea4b35; }

.yourweek-projects-list .project-red .project-name:hover,
.report-tasks-list td.project-red .name,
.popdown-edit-task .project-red {
  border-color: #ea4b35; }

.red,
.yourweek-projects-list .project-red .project-name,
.input-edit-project.project-red,
.search-projects-results .project-red a,
.popdown-edit-task .project-red,
.report-tasks-list tr:hover td.project-red .name,
.barchart-horizontal-columns-labels .red.hover {
  color: #ea4b35; }

.project-color-orange,
.barchart-horizontal-columns li .bar.orange .inner {
  background-color: #e87e04; }

.search-projects-results .project-orange a:hover {
  background: rgba(232, 126, 4, 0.3); }

.yourweek-projects-list .project-orange,
.yourweek-projects .project-orange tr:nth-of-type(2) .project-task,
.yourweek-projects-time .project-orange tr:nth-of-type(2) .project-task {
  border-color: rgba(232, 126, 4, 0.3) #e87e04; }

.yourweek-projects-list .project-orange .project-name:hover,
.report-tasks-list td.project-orange .name,
.popdown-edit-task .project-orange {
  border-color: #e87e04; }

.orange,
.yourweek-projects-list .project-orange .project-name,
.input-edit-project.project-orange,
.search-projects-results .project-orange a,
.popdown-edit-task .project-orange,
.report-tasks-list tr:hover td.project-orange .name,
.barchart-horizontal-columns-labels .orange.hover {
  color: #e87e04; }

.project-color-yellow,
.barchart-horizontal-columns li .bar.yellow .inner {
  background-color: #f2c500; }

.search-projects-results .project-yellow a:hover {
  background: rgba(242, 197, 0, 0.3); }

.yourweek-projects-list .project-yellow,
.yourweek-projects .project-yellow tr:nth-of-type(2) .project-task,
.yourweek-projects-time .project-yellow tr:nth-of-type(2) .project-task {
  border-color: rgba(242, 197, 0, 0.3) #f2c500; }

.yourweek-projects-list .project-yellow .project-name:hover,
.report-tasks-list td.project-yellow .name,
.popdown-edit-task .project-yellow {
  border-color: #f2c500; }

.yellow,
.yourweek-projects-list .project-yellow .project-name,
.input-edit-project.project-yellow,
.search-projects-results .project-yellow a,
.popdown-edit-task .project-yellow,
.report-tasks-list tr:hover td.project-yellow .name,
.barchart-horizontal-columns-labels .yellow.hover {
  color: #f2c500; }

.project-color-violet,
.barchart-horizontal-columns li .bar.violet .inner {
  background-color: #9c56b9; }

.search-projects-results .project-violet a:hover {
  background: rgba(156, 86, 185, 0.3); }

.yourweek-projects-list .project-violet,
.yourweek-projects .project-violet tr:nth-of-type(2) .project-task,
.yourweek-projects-time .project-violet tr:nth-of-type(2) .project-task {
  border-color: rgba(156, 86, 185, 0.3) #9c56b9; }

.yourweek-projects-list .project-violet .project-name:hover,
.report-tasks-list td.project-violet .name,
.popdown-edit-task .project-violet {
  border-color: #9c56b9; }

.violet,
.yourweek-projects-list .project-violet .project-name,
.input-edit-project.project-violet,
.search-projects-results .project-violet a,
.popdown-edit-task .project-violet,
.report-tasks-list tr:hover td.project-violet .name,
.barchart-horizontal-columns-labels .violet.hover {
  color: #9c56b9; }

.project-color-green,
.barchart-horizontal-columns li .bar.green .inner {
  background-color: #1fce6d; }

.search-projects-results .project-green a:hover {
  background: rgba(31, 206, 109, 0.3); }

.yourweek-projects-list .project-green,
.yourweek-projects .project-green tr:nth-of-type(2) .project-task,
.yourweek-projects-time .project-green tr:nth-of-type(2) .project-task {
  border-color: rgba(31, 206, 109, 0.3) #1fce6d; }

.yourweek-projects-list .project-green .project-name:hover,
.report-tasks-list td.project-green .name,
.popdown-edit-task .project-green {
  border-color: #1fce6d; }

.green,
.yourweek-projects-list .project-green .project-name,
.input-edit-project.project-green,
.search-projects-results .project-green a,
.popdown-edit-task .project-green,
.report-tasks-list tr:hover td.project-green .name,
.barchart-horizontal-columns-labels .green.hover {
  color: #1fce6d; }

.project-color-turquoise,
.barchart-horizontal-columns li .bar.turquoise .inner {
  background-color: #00bc9b; }

.search-projects-results .project-turquoise a:hover {
  background: rgba(0, 188, 155, 0.3); }

.yourweek-projects-list .project-turquoise,
.yourweek-projects .project-turquoise tr:nth-of-type(2) .project-task,
.yourweek-projects-time .project-turquoise tr:nth-of-type(2) .project-task {
  border-color: rgba(0, 188, 155, 0.3) #00bc9b; }

.yourweek-projects-list .project-turquoise .project-name:hover,
.report-tasks-list td.project-turquoise .name,
.popdown-edit-task .project-turquoise {
  border-color: #00bc9b; }

.turquoise,
.yourweek-projects-list .project-turquoise .project-name,
.input-edit-project.project-turquoise,
.search-projects-results .project-turquoise a,
.popdown-edit-task .project-turquoise,
.report-tasks-list tr:hover td.project-turquoise .name,
.barchart-horizontal-columns-labels .turquoise.hover {
  color: #00bc9b; }

.project-color-blue,
.barchart-horizontal-columns li .bar.blue .inner {
  background-color: #2c96de; }

.search-projects-results .project-blue a:hover {
  background: rgba(44, 150, 222, 0.3); }

.yourweek-projects-list .project-blue,
.yourweek-projects .project-blue tr:nth-of-type(2) .project-task,
.yourweek-projects-time .project-blue tr:nth-of-type(2) .project-task {
  border-color: rgba(44, 150, 222, 0.3) #2c96de; }

.yourweek-projects-list .project-blue .project-name:hover,
.report-tasks-list td.project-blue .name,
.popdown-edit-task .project-blue {
  border-color: #2c96de; }

.blue,
.yourweek-projects-list .project-blue .project-name,
.input-edit-project.project-blue,
.search-projects-results .project-blue a,
.popdown-edit-task .project-blue,
.report-tasks-list tr:hover td.project-blue .name,
.barchart-horizontal-columns-labels .blue.hover {
  color: #2c96de; }

@media only screen and (max-width: 1199px) {
  .yourweek-projects-list .project-red td.project-name,
  .yourweek-projects-time .project-red td.project-name {
    border-color: #ea4b35; }
  .yourweek-projects-list .project-orange td.project-name,
  .yourweek-projects-time .project-orange td.project-name {
    border-color: #e87e04; }
  .yourweek-projects-list .project-yellow td.project-name,
  .yourweek-projects-time .project-yellow td.project-name {
    border-color: #f2c500; }
  .yourweek-projects-list .project-violet td.project-name,
  .yourweek-projects-time .project-violet td.project-name {
    border-color: #9c56b9; }
  .yourweek-projects-list .project-green td.project-name,
  .yourweek-projects-time .project-green td.project-name {
    border-color: #1fce6d; }
  .yourweek-projects-list .project-turquoise td.project-name,
  .yourweek-projects-time .project-turquoise td.project-name {
    border-color: #00bc9b; }
  .yourweek-projects-list .project-blue td.project-name,
  .yourweek-projects-time .project-blue td.project-name {
    border-color: #2c96de; }
  .yourweek-projects-time .time-list .project-task {
    border-color: #e8ebed !important; } }

@media only screen and (min-width: 1367px) {
  .yourweek-header-days .days-list .weekend {
    width: 9%; } }

@media only screen and (max-width: 1360px) {
  /* Pages template text */
  .page-template-text .logo-head {
    margin: 55px 0 0 0; }
  .page-template-text .header-nav {
    margin: 58px 0 0 0; }
  .page-template-text .main-menu {
    float: left; }
  .page-template-text .sidenav-toggle {
    position: static;
    right: 0;
    margin: 0 0 0 40px; } }

@media only screen and (max-width: 1270px) {
  .page-template-reports .panel-inner-content {
    padding: 36px 40px 40px 35px; }
  .barchart-horizontal {
    margin: 0 auto 40px auto; }
  .donutchart-labels {
    width: 280px;
    left: -10px; }
  .donutchart-labels-right {
    left: auto;
    right: -10px; } }

@media only screen and (max-width: 1199px) {
  .yourweek-header-days .days-list-wrap {
    margin: 0 78px 0 30px; }
  .yourweek-next {
    right: 46px; }
  .yourweek-days-icon {
    width: 78px; }
  .yourweek-header-days .days-wrap {
    margin: 0 114px 0 320px; }
  .yourweek-projects,
  .yourweek-projects .project {
    width: 350px; }
  .yourweek-projects-time {
    margin: 0 0 0 350px; }
  .popdown-edit-project {
    left: 130px; }
  .yourweek-projects-time-footer {
    margin: 0 0 0 350px; }
  .yourweek-projects-time .day {
    border-left: 1px solid #e8ebed; }
  .yourweek-projects-time .empty .options {
    display: table; }
  .yourweek-projects-time .option-track-time {
    display: table-cell; }
  .yourweek-projects-time .day-sum {
    width: 78px; }
  .yourweek-projects-time-footer .time-list .day-sum {
    width: 78px; }
  .yourweek-projects-list .add-new-project {
    left: 324px; }
  .yourweek-projects-list .project-name-tr {
    display: table-row; }
  .yourweek-projects-list .yourweek-projects tr:nth-of-type(2) .project-task {
    border-color: #e8ebed; }
  .project-name-td {
    display: none; }
  /* Pages template text */
  .hero-home .hero-captions.fixed {
    width: 970px; }
  .hero-home .caption-left {
    font-size: 34px; }
  .hero-home .caption-right {
    width: 255px; }
  .feature-columns {
    margin: 0; }
  .feature-columns .list-wrap {
    margin: 0;
    width: 100%; }
  .feature-columns ul {
    width: 100%; }
  .feature-columns li {
    margin: 40px 0; }
  .faq-content {
    width: 600px; } }

@media only screen and (max-width: 1100px) {
  .projects-list .project-time {
    padding: 0 10px 0 5px;
    font-size: 12px; } }

@media only screen and (max-width: 1000px) {
  .panel-sidebar-left {
    width: 200px;
    padding: 70px 0 0 0; }
  .panel-middle-content {
    padding: 0 20px 0 210px; }
  .holidays-calendar-wrap {
    padding: 0; }
  .panel-menu {
    height: 100%; }
  .yourweek-header .logo-head {
    display: none; }
  .header-mobile,
  .mobile-show {
    display: block; }
  .panel-sidebar {
    top: 94px;
    -webkit-transform: translateX(150%);
    -ms-transform: translateX(150%);
    transform: translateX(150%); }
  .panel-sidebar.active {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0); }
  .panel-content {
    padding: 0; }
  .yourweek-header {
    height: 118px; }
  .yourweek-header-days {
    height: 118px; }
  .yourweek-days-icon {
    display: none; }
  .yourweek-header-days .days-wrap {
    margin: 0 auto;
    width: 520px;
    height: 118px; }
  .yourweek-control,
  .yourweek-prev,
  .yourweek-next {
    width: 60px;
    height: 118px;
    line-height: 118px;
    text-align: center;
    font-size: 60px; }
  .yourweek-next {
    right: 0; }
  .yourweek-header-days .days-list-wrap {
    margin: 0 60px;
    height: 118px; }
  .yourweek-header-days .days-list .week {
    width: 1400px;
    height: 118px; }
  .yourweek-header-fixed,
  .yourweek-header-days .days-list .week,
  .yourweek-header-fixed .yourweek-header-days,
  .yourweek-header-fixed .yourweek-header-days .days-wrap,
  .yourweek-header-fixed .yourweek-header-days .days-list-wrap {
    height: 56px;
    overflow: hidden; }
  .yourweek-header-days .days-list .day,
  .yourweek-header-days .days-list .day-sum {
    width: 200px;
    height: 118px;
    color: #293b4d;
    font-weight: bold; }
  .yourweek-header-days .days-list .weekend .month {
    display: inline; }
  .yourweek-header-days .days-list .day-number {
    font-size: 32px;
    line-height: 32px;
    font-weight: bold; }
  .yourweek-header-days .days-list .day-name {
    font-size: 16px; }
  .yourweek-projects-list {
    margin: 118px 0 0 0; }
  .yourweek-projects-list,
  .yourweek-projects .project {
    width: 100%; }
  .yourweek-projects {
    width: auto;
    margin: 0 432px 0 0; }
  .yourweek-projects-time {
    float: left;
    right: 0;
    left: auto;
    width: 432px; }
  .yourweek-projects .project {
    border-width: 0 0 0 12px; }
  .yourweek-projects .project-task {
    padding: 0 0 0 20px;
    height: 106px;
    overflow: hidden;
    font-size: 26px;
    line-height: 28px; }
  .yourweek-projects-time {
    margin: 0;
    padding: 0; }
  .yourweek-projects-time .week,
  .yourweek-projects-time .project-task,
  .yourweek-projects-time-footer .time-list .week {
    width: 1512px; }
  .yourweek-projects-time .day-sum,
  .yourweek-projects-time-footer .time-list .day-sum {
    display: none; }
  .yourweek-projects-time .day,
  .yourweek-projects-time .time-list .weekend,
  .yourweek-projects-time-footer .time-list .day,
  .yourweek-projects-time-footer .time-list .weekend {
    width: 216px;
    height: 105px;
    font-size: 26px; }
  .yourweek-projects-time .time-list .project-task {
    height: 106px !important; }
  .yourweek-projects-time-footer {
    margin: 0;
    width: 100%; }
  .yourweek-projects-time-footer .time-list-wrap {
    float: right;
    width: 432px;
    height: 106px; }
  .yourweek-projects-time .option-track-time {
    display: table-cell; }
  .yourweek-projects-time .empty .options {
    display: table; }
  .yourweek-projects-time .option.fa-plus {
    font-size: 36px; }
  .yourweek-projects-list .add-new-project {
    left: auto;
    right: 194px; }
  .page-template-yourweek .edit-entry {
    height: 104px;
    line-height: 104px;
    font-size: 26px;
    background: #f6f8f9; }
  .page-template-yourweek .edit-time input {
    height: 104px;
    font-size: 26px;
    background: #f6f8f9; }
  .page-template-yourweek .track-time .stop {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: 0 0 0 10px;
    font-size: 26px;
    line-height: 104px; }
  .page-template-yourweek .track-time:hover .seconds {
    opacity: 1; }
  .popdown.popdown-yourweek {
    background: transparent;
    -webkit-box-shadow: 0 5px 7px 1px rgba(41, 59, 77, 0);
    box-shadow: 0 5px 7px 1px rgba(41, 59, 77, 0); }
  .popdown.popdown-yourweek .popdown-input-wrap {
    position: absolute;
    bottom: 0;
    left: 0; }
  .popdown.popdown-yourweek {
    width: 98% !important;
    height: 318px;
    position: fixed;
    left: 7px !important;
    top: auto !important;
    bottom: 0;
    width: 98% !important; }
  .popdown-edit-task.popdown-yourweek {
    height: 363px; }
  .popdown.popdown-yourweek .popdown-input {
    line-height: normal;
    border-top: 1px solid #d6dde1;
    height: 58px;
    font-size: 16px;
    -webkit-box-shadow: 0 5px 7px 1px rgba(41, 59, 77, 0.25);
    box-shadow: 0 5px 7px 1px rgba(41, 59, 77, 0.25); }
  .popdown.popdown-yourweek .popdown input.input-edit-project,
  .popdown.popdown-yourweek .popdown input.input-edit-task {
    height: 58px;
    line-height: 58px;
    background: #f6f8f9;
    font-size: 16px; }
  .popdown input::-webkit-input-placeholder {
    font-size: 16px; }
  .popdown input::-moz-placeholder {
    font-size: 16px; }
  .popdown input:-moz-placeholder {
    /* Older versions of Firefox */
    font-size: 16px; }
  .popdown input:-ms-input-placeholder {
    font-size: 16px; }
  .popdown-input {
    height: 58px;
    font-size: 16px; }
  .popdown-filter .popdown-input-wrap {
    line-height: 46px; }
  .popdown-filter .popdown-input {
    height: 46px;
    line-height: 46px; }
  .popdown.popdown-yourweek .popdown-list-wrap {
    position: absolute;
    bottom: 58px;
    display: table;
    width: 100%;
    height: 260px; }
  .popdown.popdown-yourweek .popdown-list {
    position: static;
    width: 100%;
    height: 100%;
    display: table-cell;
    vertical-align: bottom;
    border-top: 1px solid #d6dde1;
    -webkit-box-shadow: 0 5px 7px 1px rgba(41, 59, 77, 0.25);
    box-shadow: 0 5px 7px 1px rgba(41, 59, 77, 0.25); }
  .popdown.popdown-yourweek .popdown-list ul {
    max-height: 260px; }
  .popdown.popdown-yourweek .popdown-list a {
    padding: 20px 0 20px 26px;
    height: auto;
    max-height: auto;
    font-size: 16px;
    line-height: 18px; }
  .popdown-edit-task.popdown-yourweek .current-project {
    display: block; }
  .popdown.popdown-yourweek .search-tasks {
    background: #ffffff; }
  .popdown .close,
  .edit-entry .close {
    width: 42px; }
  .popdown .close .icon-css-close,
  .edit-entry .close .icon-css-close {
    width: 16px;
    height: 16px; }
  .popdown .close .icon-css-close:before,
  .edit-entry .close .icon-css-close:before {
    left: 4px;
    width: 2px;
    height: 17px; }
  .popdown .close .icon-css-close:after,
  .edit-entry .close .icon-css-close:after {
    left: 4px;
    width: 2px;
    height: 17px; }
  .popdown .close,
  .edit-entry .close {
    display: block; }
  .track-time .close {
    display: none; }
  .edit-entry {
    margin: 2px 0 0 0; }
  .page-template-panel .page-header .logo-head,
  .graphs-type-picker,
  .barchart-section,
  .graphs .graphs-buttons,
  .page-title-line {
    display: none; }
  .panel-page-title h1 {
    font-size: 36px;
    text-transform: none; }
  .page-template-reports .panel-inner-content {
    padding: 0 0 40px 0; }
  .page-template-reports .reports-filter-container {
    background: #f6f8f9;
    padding: 0; }
  .graphs {
    float: left;
    margin: 0;
    padding: 50px 0 0 0;
    background: #ffffff; }
  .donutchart {
    width: 100%; }
  .donutchart.visible, .donutchart.visible .chart {
    height: auto; }
  .reports-filter {
    display: block;
    margin: 0 40px;
    width: auto;
    height: auto;
    background: transparent;
    border: 0 none transparent; }
  .reports-filter .filter-button {
    display: block;
    margin: 0 0 14px 0;
    width: 100%;
    height: 46px;
    line-height: 46px;
    font-size: 16px;
    border: 1px solid #d6dde1;
    background: #ffffff; }
  .reports-filter .button-search-project {
    width: 50%;
    float: left; }
  .reports-filter .button-search-user {
    width: 50%;
    float: left;
    border-left: 0 none transparent; }
  .reports-filter .button-date-range {
    clear: both; }
  .search-task-input,
  .date-range-selected,
  .reports-filter .button-date-range .date-range-control {
    height: 44px;
    line-height: 44px;
    vertical-align: top; }
  .search-task-input {
    line-height: normal; }
  .reports-filter .filter-button .fa-angle-down {
    float: right;
    margin: 0 20px 0 0;
    height: 44px;
    line-height: 44px; }
  .reports-filter .date-range-wrap {
    width: 100%;
    height: 44px; }
  .daterangepicker .ranges {
    padding: 14px;
    background: #ffffff; }
  .daterangepicker .ranges li {
    width: 50%;
    line-height: 50px;
    height: 50px;
    font-size: 20px;
    text-align: center; }
  .reports-filter-set {
    padding: 21px 40px 0 40px; }
  .donutchart-container,
  #donutchart-container {
    width: 480px !important;
    max-height: 380px !important; }
  .donutchart-labels {
    position: relative;
    left: auto;
    right: auto;
    float: none;
    display: block;
    width: 100%;
    height: auto; }
  .donutchart-labels ul {
    display: block;
    padding: 0; }
  .donutchart-labels li .data-label {
    padding: 0 60px;
    width: 100%;
    height: auto;
    box-shadow: 0 0 0 transparent; }
  .donutchart-labels li .name,
  .donutchart-labels li .data-label {
    font-size: 18px; }
  .donutchart-labels li .name {
    float: left;
    width: 60%;
    text-align: left; }
  .donutchart-labels li .value {
    float: right;
    padding: 0 0 0 20px;
    width: 40%;
    text-align: right; }
  .billing-information .section-right {
    padding-left: 20px; }
  .fc-year-main-table {
    max-width: 780px; }
  /* Pages template text */
  .hero-home {
    padding: 0 0 80px 0;
    background-color: #364e64;
    background-size: cover; }
  .hero-subpage,
  .hero .hero-content-container,
  .hero-home,
  .hero-home .container {
    // height: auto;
     }
  .hero-home .hero-captions {
    position: relative;
    z-index: 10;
    display: block;
    padding: 155px 0 0 0;
    height: auto;
    text-align: center; }
  .hero-home .caption-left {
    position: static;
    margin: 0 0 50px 0;
    font-size: 42px;
    line-height: 48px; }
  .hero-home .caption-right {
    position: static;
    margin: 0 auto;
    width: 100%;
    max-width: 520px;
    font-size: 24px;
    line-height: 36px; }
  .hero-home .middle {
    position: relative;
    margin: -80px auto 80px auto; }
  .hero-home .page-title {
    position: static; }
  .feature-columns li {
    width: 50%; }
  .testimonial-list,
  .testimonial-list .inner {
    height: auto; }
  .faq-content {
    float: none;
    width: 100%; }
  .faq-nav {
    float: none;
    width: 100%;
    margin: 0 0 40px 0; }
  .hero-faq-image {
    display: none; } }

@media only screen and (max-width: 850px) {
  /* Pages template text */
  .page-template-text .page-header {
    padding: 0 15px; }
  .page-template-text .logo-head {
    margin: 35px 0 0 0; }
  .page-template-text .logo-head img {
    width: 100%;
    height: auto; }
  .page-template-text .header-nav {
    margin: 35px 0 0 0; }
  .testimonial-pagination li {
    margin: 0 10px; }
  .cta-white {
    padding: 55px 70px; }
  .page-footer-columns {
    display: block;
    margin: 0 30px;
    width: auto; }
  .page-footer-columns .column {
    display: block; }
  .page-footer-columns .about {
    width: auto;
    padding: 40px 0 50px 0;
    border-right: 0 none transparent; }
  .footer-menu {
    padding: 0 0 50px 0; }
  .footer-menu a {
    display: block;
    padding: 6px 0; }
  .page-footer-columns .copyright-column {
    padding: 0 0 60px 0;
    text-align: left; } }

@media only screen and (max-width: 840px) {
  .fc-year-main-table {
    max-width: 585px; } }

@media only screen and (max-width: 780px) {
  .report-tasks-list td.col-project .name {
    vertical-align: top;
    font-size: 12px;
    line-height: 16px; }
  .report-tasks-list td {
    vertical-align: top;
    font-size: 14px;
    line-height: 16px; }
  .report-tasks-list .col-project {
    text-align: left; }
  .report-tasks-list th.col-project {
    padding: 10px 0 0 16px; }
  .report-tasks-list th.col-task,
  .report-tasks-list th.col-time,
  .report-tasks-list th.col-users {
    padding: 10px 0 0 10px; }
  .report-tasks-list td.col-project .name,
  .report-tasks-list td.col-task,
  .report-tasks-list td.col-time,
  .report-tasks-list td.col-users {
    padding: 10px 0 10px 10px; }
  .report-tasks-list td.col-updated {
    padding: 10px 10px 10px 0; }
  .faq-question .title {
    position: relative;
    padding: 10px 35px 10px 76px; }
  .faq-question .title .fa {
    position: absolute;
    right: 10px;
    top: 50%;
    margin: -12px 0 0 0; } }

@media only screen and (max-width: 740px) {
  .panel-sidebar {
    top: 94px;
    -webkit-transform: translateX(150%);
    -ms-transform: translateX(150%);
    transform: translateX(150%); }
  .panel-sidebar.active {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0); }
  .panel-content {
    padding: 0; }
  .yourweek-header .logo-head,
  .mobile-hide {
    display: none; }
  .header-mobile,
  .mobile-show {
    display: block; }
  .panel-sidebar {
    top: 94px;
    -webkit-transform: translateX(150%);
    -ms-transform: translateX(150%);
    transform: translateX(150%); }
  .panel-sidebar.active {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0); }
  .panel-content {
    padding: 0; }
  .yourweek-header {
    height: 118px; }
  .yourweek-header-days {
    height: 118px; }
  .yourweek-days-icon {
    display: none; }
  .yourweek-header-days .days-wrap {
    margin: 0 auto;
    width: 320px; }
  .yourweek-control,
  .yourweek-prev,
  .yourweek-next {
    width: 60px;
    height: 118px;
    line-height: 118px;
    text-align: center;
    font-size: 60px; }
  .yourweek-next {
    right: 0; }
  .yourweek-header-days .days-list-wrap {
    margin: 0 60px; }
  .yourweek-header-days .days-list .week {
    width: 1400px;
    height: 118px; }
  .yourweek-header-days .days-list .day,
  .yourweek-header-days .days-list .day-sum {
    width: 200px;
    height: 118px;
    color: #293b4d;
    font-weight: bold; }
  .yourweek-header-days .days-list .weekend .month {
    display: inline; }
  .yourweek-header-days .days-list .day-number {
    font-size: 32px;
    line-height: 32px;
    font-weight: bold; }
  .yourweek-header-days .days-list .day-name {
    font-size: 16px; }
  .yourweek-projects-list,
  .yourweek-projects .project {
    width: 100%; }
  .yourweek-projects {
    width: auto;
    margin: 0 216px 0 0; }
  .yourweek-projects-time {
    float: left;
    right: 0;
    left: auto;
    width: 216px; }
  .yourweek-projects .project {
    border-width: 0 0 0 12px; }
  .yourweek-projects-list .project-name-tr {
    display: table-row; }
  .yourweek-projects .project-task {
    padding: 0 0 0 20px;
    height: 106px;
    overflow: hidden;
    font-size: 26px;
    line-height: 28px; }
  .yourweek-projects-list .yourweek-projects tr:nth-of-type(2) .project-task {
    border-color: #e8ebed; }
  .project-name-td {
    display: none; }
  .yourweek-projects-time {
    margin: 0;
    padding: 0; }
  .yourweek-projects-time .week,
  .yourweek-projects-time .project-task,
  .yourweek-projects-time-footer .time-list .week {
    width: 1512px; }
  .yourweek-projects-time .day-sum,
  .yourweek-projects-time-footer .time-list .day-sum {
    display: none; }
  .yourweek-projects-time .day {
    border-left: 0 none transparent; }
  .yourweek-projects-time .day,
  .yourweek-projects-time .time-list .weekend,
  .yourweek-projects-time-footer .time-list .day,
  .yourweek-projects-time-footer .time-list .weekend {
    width: 216px;
    height: 105px;
    font-size: 26px; }
  .yourweek-projects-time .time-list .project-task {
    height: 106px !important; }
  .yourweek-projects-time-footer {
    margin: 0;
    width: 100%; }
  .yourweek-projects-time-footer .time-list-wrap {
    float: right;
    width: 216px;
    height: 106px; }
  .yourweek-projects-time .option-track-time {
    display: table-cell; }
  .yourweek-projects-time .empty .options {
    display: table; }
  .yourweek-projects-time .option.fa-plus {
    font-size: 36px; }
  .yourweek-projects-list .add-new-project {
    left: auto;
    right: 194px; }
  .page-template-yourweek .edit-entry {
    height: 104px;
    line-height: 104px;
    font-size: 26px;
    background: #f6f8f9; }
  .page-template-yourweek .edit-time input {
    height: 104px;
    font-size: 26px;
    background: #f6f8f9; }
  .page-template-yourweek .track-time .stop {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: 0 0 0 10px;
    font-size: 26px;
    line-height: 104px; }
  .page-template-yourweek .track-time:hover .seconds {
    opacity: 1; }
  .box-form {
    margin-bottom: 30px; }
  .billing-information .section {
    padding: 30px 20px 26px 20px; }
  .page-template-projects .panel-sidebar-left {
    float: none;
    margin: 0 auto;
    padding: 20px 0 0 0; }
  .page-template-projects .panel-middle-content {
    float: none;
    margin: 0 auto;
    padding: 0 10px 0 10px; }
  .page-template-projects .projects-list {
    padding: 10px 0 10px 0; }
  .page-template-projects .row-js-edit-field {
    padding: 0 42px 0 10px; } }

@media only screen and (max-width: 670px) {
  .feature-textblock {
    margin: 30px 0 0 30px; }
  .feature-right .feature-textblock {
    margin: 30px 0 0 0;
    width: 50%; }
  .feature-mockups {
    min-width: 0;
    left: auto;
    right: 0; }
  .feature-right .feature-mockups {
    left: 0;
    right: auto; }
  .feature-mockups .laptop {
    display: none; } }

@media only screen and (max-width: 620px) {
  .billing-information .inner {
    display: block; }
  .billing-information .section {
    display: block;
    width: 100%; }
  .billing-information .section-left {
    border-right: 0 none transparent; } }

@media only screen and (max-width: 580px) {
  .form-section-gray {
    padding: 20px 20px 0 20px; }
  .form-section-gray.top-section {
    padding: 20px 10px 10px 10px; }
  .box-form .help-block {
    display: none; }
  .daterangepicker .calendar {
    display: block;
    margin: 0 auto 20px auto; }
  /* Pages template text */
  .page-template-text .logo-head {
    margin: 40px 0 0 0;
    width: 150px; }
  .hero-home {
    padding: 0 0 60px 0; }
  .hero-home .caption-left {
    font-size: 32px;
    line-height: 34px; }
  .hero-home .caption-right {
    font-size: 18px;
    line-height: 24px; }
  .page-template-text .page-title .title {
    font-size: 30px;
    line-height: 40px; }
  .extended-features .feature {
    margin: -20px 0 0 0;
    padding: 40px 0 60px 0;
    height: 550px; }
  .feature-textblock {
    width: 240px; }
  .feature-columns p br,
  .feature-textblock br {
    display: none; }
  .feature-content,
  .feature-textblock {
    height: auto; }
  .feature-right .feature-textblock {
    margin: 0 36px 0 30px; }
  .feature-mockups {
    top: -80px;
    right: -40px; }
  .feature-right .feature-mockups {
    left: -40px; }
  .testimonial {
    margin: 40px 0 40px 0; }
  .cta-white {
    margin: 40px 0 0 0; }
  .cta-white .heading {
    margin: 0 0 20px 0; }
  .testimonial-list-wrap {
    height: auto; }
  .testimonial-list .inner {
    padding: 30px 20px 0 20px; }
  .ml-show {
    display: block; }
  .faq {
    margin: 42px 0 0 0; }
  .faq-question .title {
    padding: 10px 35px 10px 56px; }
  .faq-question .answer {
    padding: 0; }
  .faq-question .answer .image img {
    max-width: 100%; } }

@media only screen and (max-width: 510px) {
  /* Pages template text */
  .hero-home .middle {
    margin: -40px auto 40px auto;
    width: 252px; }
  .hero-home .hero-image {
    height: 346px; }
  .hero-home .hero-image img {
    height: auto; }
  .hero-home .hero-image .parts {
    left: -4px;
    width: 251px; }
  .hero-home .hero-image .papers {
    left: 29px;
    top: 58px;
    width: 188px; }
  .hero-home .hero-image .eclipse-shade {
    width: 88px; }
  .hero-home .hero-image .character {
    margin: 57px auto 0 auto;
    width: 185px; }
  .hero-home .hero-image .character:after {
    height: 50px; }
  .hero-home .middle .cta {
    top: 200px;
    padding: 20px 0 0 0; }

  .hero-home .middle .cta .btn {
    width: 100%; 

  }
  .feature-mockups {
    top: -80px;
    right: -80px; }
  .feature-right .feature-mockups {
    left: -80px; } }

@media only screen and (max-width: 480px) {
  .yourweek-header-days .days-list .day-number {
    font-size: 28px;
    line-height: 28px;
    font-weight: bold; }
  .yourweek-projects .project-task {
    font-size: 22px;
    line-height: 24px; }
  .yourweek-projects-list .project-name-tr td.project-name {
    font-size: 16px; }
  .yourweek-projects-time .day,
  .yourweek-projects-time .time-list .weekend,
  .yourweek-projects-time-footer .time-list .day,
  .yourweek-projects-time-footer .time-list .weekend {
    font-size: 22px; }
  .yourweek-projects-time .option.fa-plus {
    font-size: 30px; }
  .page-template-yourweek .edit-entry,
  .page-template-yourweek .edit-time input,
  .page-template-yourweek .track-time .stop {
    font-size: 22px; }
  .donutchart-labels li .data-label {
    padding: 0 20px; }
  .donutchart-container,
  #donutchart-container {
    width: 400px !important;
    max-height: 340px !important; }
  .projects-list .project {
    display: block;
    position: relative;
    padding: 0 0 0 8px; }
  .projects-list .project-color-col {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%; }
  .projects-list .can-edit:hover .project-color-col,
  .projects-list .editing .project-color-col {
    width: 8px; }
  .projects-list .project-color-panel {
    top: 50%;
    margin: -27px 0 0 0; }
  .projects-list .project-left-content {
    display: block;
    width: auto;
    margin: 0 0 0 8px; }
  .projects-list .row-js-edit {
    display: block;
    padding: 0 90px 0 0; }
  .projects-list .can-edit:hover .project-name,
  .projects-list .editing .project-name,
  .projects-list .project-name,
  .projects-list .can-edit .project-name {
    padding: 9px 0 9px 12px; }
  .projects-list .project-options,
  .projects-list .can-edit:hover .project-options {
    display: block;
    float: right;
    width: 90px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3; }
  .projects-list .row-js-edit-field {
    z-index: 4; }
  .projects-list .project-options .project-option {
    opacity: 0.5; }
  .project-option-undo {
    padding: 9px 0 9px 10px; }
  .projects-list .project-time {
    display: block;
    padding: 0 42px 0 20px;
    height: 42px;
    line-height: 42px;
    text-align: left; }
  .projects-list .project-option-reports {
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 42px;
    border: 0 none transparent; }
  .project-archived .project-time,
  .project-archived .project-option-edit,
  .project-archived .project-option-archive,
  .project-archived .project-option-reports {
    display: none; } }

@media only screen and (max-width: 479px) {
  .header-mobile-button {
    width: 64px; }
  .menu-mobile-trigger .line {
    right: 16px; }
  .yourweek-projects .project-task {
    height: 53px;
    font-size: 13px;
    line-height: 14px; }
  .yourweek-projects .project-task table {
    height: 52px; }
  .yourweek-projects-list .project-name-tr td.project-name {
    font-size: 12px; }
  .yourweek-projects-time .day,
  .yourweek-projects-time .time-list .weekend,
  .yourweek-projects-time-footer .time-list .day,
  .yourweek-projects-time-footer .time-list .weekend {
    font-size: 22px; }
  .yourweek-projects-time .option.fa-plus {
    font-size: 30px; }
  .page-template-yourweek .edit-entry {
    height: 52px;
    line-height: 52px; }
  .page-template-yourweek .track-time .seconds-wrap {
    height: 52px;
    line-height: 52px; }
  .page-template-yourweek .track-time .stop {
    line-height: 52px; }
  .page-template-yourweek .edit-entry,
  .page-template-yourweek .edit-time input,
  .page-template-yourweek .track-time .stop {
    font-size: 12px; }
  .popdown input.input-edit-project,
  .popdown input.input-edit-task {
    height: 58px;
    font-size: 14px; }
  .popdown input::-webkit-input-placeholder {
    font-size: 14px; }
  .popdown input::-moz-placeholder {
    font-size: 14px; }
  .popdown input:-moz-placeholder {
    /* Older versions of Firefox */
    font-size: 14px; }
  .popdown input:-ms-input-placeholder {
    font-size: 14px; }
  .popdown-list .results a {
    padding: 10px 0 10px 26px;
    height: auto;
    font-size: 14px;
    line-height: 16px; }
  .popdown.popdown-filter .search-projects-results a {
    padding: 10px 0 10px 16px;
    height: auto;
    font-size: 12px;
    line-height: 16px; }
  .popdown.popdown-yourweek .popdown-list a {
    padding: 20px 0 20px 26px;
    font-size: 14px;
    line-height: 16px; }
  .popdown.popdown-filter .popdown-input {
    padding: 0 0 0 16px; }
  .yourweek-projects {
    margin: 0 108px 0 0; }
  .yourweek-projects-time {
    width: 108px; }
  .yourweek-projects-time .week,
  .yourweek-projects-time .project-task,
  .yourweek-projects-time-footer .time-list .week {
    width: 756px; }
  .yourweek-projects-time .time-list .project-task {
    height: 53px !important;
    overflow: hidden; }
  .yourweek-projects-time .day,
  .yourweek-projects-time .time-list .weekend,
  .yourweek-projects-time-footer .time-list .day,
  .yourweek-projects-time-footer .time-list .weekend {
    width: 108px;
    height: 52px;
    font-size: 12px; }
  .yourweek-projects-time-footer .time-list-wrap {
    width: 108px; }
  .page-template-yourweek .edit-time input {
    width: 74px;
    height: 52px; }
  .yourweek-projects-time .option.fa-plus {
    font-size: 20px; }
  .yourweek-projects-list .add-new-project {
    right: 84px; }
  .reports-filter {
    margin: 0 20px; }
  .reports-filter .filter-button .fa-angle-down {
    margin: 0 10px 0 0; }
  .daterangepicker .ranges li {
    font-size: 14px; }
  .reports-filter-set {
    padding: 21px 20px 0 20px; }
  .donutchart-container,
  #donutchart-container {
    width: 320px !important;
    max-height: 280px !important; }
  .donutchart-container .donut-inner {
    margin: 0 0 0 -100px; }
  .report-tasks-list td,
  .report-tasks-list td.col-users,
  .report-tasks-list td.col-updated {
    font-size: 12px;
    line-height: 14px; }
  .payments-history .history,
  .payments-history .history .entry,
  .payments-history .history .cell {
    display: block; }
  .payments-history .history .entry {
    margin: 0 0 25px 0; }
  .payments-history .history .cell,
  .payments-history .history .title {
    padding: 0 0 6px 0; }
  .payments-history .history .options {
    text-align: left; }
  /* Pages template text */
  .page-template-text .main-menu {
    display: none; }
  .page-template-text .main-menu a {
    padding: 0 10px; }
  .page-template-text .sidenav .mobile-visible {
    display: block; }
  .extended-features .feature {
    height: auto; }
  .extended-features .feature-right {
    padding: 40px 0 80px 0; }
  .feature-textblock {
    width: 160px; }
  .feature-textblock .icon {
    width: 32px; }
  .feature-columns .heading,
  .feature-textblock .heading {
    margin: 0 0 18px 0;
    font-size: 20px; }
  .feature-columns p,
  .feature-textblock-inner p {
    margin: 18px 0 0 0;
    font-size: 14px;
    line-height: 20px; }
  .feature-mockups {
    right: -80px; }
  .feature-right .feature-mockups {
    left: -80px; }
  .feature-mockups img {
    width: auto;
    height: 360px; }
  .feature-columns li {
    padding: 0 10px; }
  .page-footer-columns {
    margin: 0; }
  .page-template-text .btn-primary {
    padding: 20px 20px 16px 20px;
    font-size: 16px; }
  .cta-white {
    padding: 55px 10px; }
  .cta-white p {
    line-height: 30px; }
  .testimonial-list p {
    font-size: 16px;
    line-height: 26px; } }

@media only screen and (max-width: 380px) {
  .modal .project-color-panel {
    width: 258px;
    height: 42px; }
  .project .project-color-panel {
    height: 42px; }
  .project .project-color-panel.active {
    width: 302px; }
  .project-color-panel .inner,
  .modal .project-color-panel .inner {
    padding: 4px; }
  .project .project-color-list {
    top: 4px;
    left: 48px; }
  .project .project-color-list,
  .modal .project-color-list {
    width: 252px;
    height: 34px; }
  .project .project-color-list li,
  .modal .project-color-list li {
    margin: 0 2px 0 0; }
  .project-color-panel .project-current-color {
    margin: 0 10px 0 0; }
  .project-color-panel .project-current-color > div,
  .project .project-color-list a,
  .modal .project-color-list a {
    width: 34px;
    height: 34px; }
  .modal-holidays .form-date-input {
    display: block;
    margin: 0 auto 10px auto; } }


  span.fr {
    color: #fff;
    padding-top: 20px;
    letter-spacing: 1px;
    padding-left: 35px;
    background: url(/images/sj.png) no-repeat left 15px;
    background-size: 30px;
  } 

  .show_wrap{
    width: 100%;background: url('/images/bg_2.png') no-repeat center center;margin-top:-5px;padding: 80px 0;
  }
  .show_wrap>p{text-align: center;font-size: 30px;margin-top:0;letter-spacing: 2px; color:#222;}
  .show {position: relative;}
  .show .item{padding-top: 100px;}
  
  .show .item img{width: 80%;}
  .item_c{width:30%!important;padding: 0!important;}
  .item_c img{width: 62%!important;}

  .way{display: inline-block;margin:0 15px;}
  .way>span{display: block;text-align: center;margin-top:30px;font-size:18px;}
  .way img{width: 90%;}

  .thumbnail {
    background: transparent;
    border:none;
    img {
      height: 200px;
    }
    h5 {
      color: #000;
      text-align: center;
    }
  }

  .why {
    width: 100%;
    background: url(/images/bg_3.png) no-repeat center center;
    background-color: #fff;
    background-size: auto 70%;
    padding: 0 0 70px 0;
    .pro {
      margin-bottom: 40px;
      h3 {
          color: #444;
          background: url(/images/dian.png) no-repeat left 8px;
          border-bottom: 1px dotted #999;
          padding-left: 30px;
          font-size: 20px;
          padding-bottom: 5px;
      }

      p {
        padding-left: 30px;
        color: #999;
        font-size: 17px;
        letter-spacing: 1px;
      }
    }
  }

  .footer {
    padding-top: 10px;
    padding-bottom: 10px;
    background: #313944;
    color: white;
  }

  
